let uu = document.querySelector('#product>ul')


request(0);
//获取数据的方法
function request(pageid) {
    fetch("http://chst.vip:1234/api/getmoneyctrl?pageid=" + pageid)
        .then(response => response.json())
        .then(res => {
            //渲染一下数据
            // console.log(res.result);
            render(res.result, uu)
        })
}



/**
 * 
 * @param {Object} data 渲染的数据源
 * @param {Element} el 渲染的数据添加到的dom元素
 */
function render(data, el) {
    let domStr = ''
    // console.log(data);
    data.forEach(item => {
        let regExp = /(?<=imgurl=)[^'"]*/
        let imgURL = item.productImgSm.match(regExp)
        domStr += `<li class="clearfix" productid=${item.productId}>
        <img src=${imgURL} alt="">
        <div class="info">
            <div class="title">
                <h4>${item.productName}
                </h4>
            </div>
            <div class="other">
                <b>${item.productFrom}|${item.productTime}</b><em>${item.productComCount}</em>
            </div>
        </div>
    </li>`
        el.innerHTML = domStr
    })
}



//点击select切换页面

//获取元素
let select = document.querySelector("#changePage select")
let prev = document.querySelector(".prev")
let next = document.querySelector(".next")

let pageid = 1;
next.onclick = () => {
    pageid++
    console.log(pageid);
    if (pageid === 14) {
        next.disabled = true
        request(pageid)
        select.children[pageid - 1].selected = true
    } else {
        prev.disabled = false
        request(pageid)
        select.children[pageid - 1].selected = true
    }

}

prev.onclick = () => {
    pageid--
    console.log(pageid);
    if (pageid === 1) {
        prev.disabled = true
        request(pageid)
        select.children[pageid - 1].selected = true
    } else {
        next.disabled = false
        request(pageid)
        select.children[pageid - 1].selected = true
    }
}

select.onchange = () => {
    let page = select.selectedIndex + 1;
    request(page);
    pageid = page
    console.log(pageid);
    if (page === 1) {
        prev.disabled = true
    } else if (page === 14) {
        next.disabled = true
    } else {
        prev.disabled = false
        next.disabled = false
    }
}


uu.onclick = e => {
    let _this = e.target;
    if (_this.localName === "li") {
        let id = _this.getAttribute('productid')
        console.log(id);
        location.href = "./moneyctrldetail.html?productid=" + id
    } else if (_this.localName === "div" || _this.localName === "img") {
        let id = _this.parentNode.getAttribute('productid')
        console.log(id);
        location.href = "./moneyctrldetail.html?productid=" + id
    } else if (_this.localName === "h4" || _this.localName === "b") {
        let id = _this.parentNode.parentNode.parentNode.getAttribute('productid')
        location.href = "./moneyctrldetail.html?productid=" + id
        console.log(id);

    }
}
